<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>全部订单</title>
    <link rel="stylesheet" href="../css/global.css">
    <link rel="stylesheet" href="../css/allorders.css">
    <link rel="stylesheet" href="../css/orderpublic.css">
</head>

<body>
    <!-- 最外层容器 -->
    <div class="iot_whole_wrap">
        <div class="iot_top">
            <div class="iot_back">
               <a href="my.html"><</a> 
            </div>
                    <div class="iot_top_title">订单列表</div>
            </div>
            <div class="iot_mid">
                <li class="iot_mid_tab active">全部</li>
                <li class="iot_mid_tab">待付款</li>
                <li class="iot_mid_tab">待发货</li>
                <li class="iot_mid_tab">待收货</li>
                <li class="iot_mid_tab">待评价</li>
            </div>
            <div class="iot_buttom">
                <div class="iot_buttom_item">
                    <div class="iot_item_top">
                        <div class="iot_time">
                            2024-10-01 &nbsp; 09:56:41
                        </div>
                        <div class="iot_state">待发货</div>
                    </div>
                    <div class="iot_item_mid">
                        <div class="iot_item_img">
                            <img src="../images/yizhan2.png">
                        </div>
                        <div class="iot_item_right">
                            <div class="iot_right_top">
                                居家旅行常备家用医疗包(含医疗用品)
                            </div>
                            <div class="iot_right_buttom">
                                新版白色
                            </div>
                        </div>
                    </div>
                    <div class="iot_item_down">
                        <div class="iot_down_top">
                            <div class="iot_dt_left">共三件商品</div>
                            <div class="iot_dt_right">实付￥183</div>
                        </div>
                        <div class="iot_down_down">再次购买</div>
                    </div>
                </div>
            </div>
        </div>
        <script>
            var lis = document.querySelectorAll('.iot_mid_tab')
            for (let i = 0; i < lis.length; i++) {
                lis[i].addEventListener('click', () => {
                    for (let j = 0; j < 5; j++) {
                        lis[j].className = 'iot_mid_tab'
                    }
                    lis[i].className = 'iot_mid_tab active'
                })
            }
        </script>
</body>

</html>